﻿<!DOCTYPE html>
<html lang="zh">

<head resource>
    <include file="../inc/meta.inc" />
    <title>学习卡设置项</title>

</head>

<body>
    <div id="app" v-cloak>
        <div class="toolsbar">
            <btngroup show="新增,修改,删除" ref='btngroup' @delete="deleteData" @cardquery="cardquery" path="CardsetModify"
                width="800" height="600" :selects='selects' idkey='Lcs_ID' table="datatables"></btngroup>
            <query_panel :model="form" :loading="loading" @search="handleCurrentChange(1)">
                <el-form-item label="">
                    <el-select v-model="form.orgid" placeholder="--所有机构--" clearable>
                        <el-option class="organs_option" v-for="(item,index) in organs" :key="item.Org_ID"
                            :label="item.Org_PlatformName" :value="item.Org_ID">
                            <div>
                                <span>{{index+1}}.</span>
                                <span>
                                    {{ item.Org_PlatformName }}
                                </span>
                            </div>
                            <div style="float: right; color: #8492a6; font-size: 13px">{{ item.Org_Name }}</div>

                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="">
                    <el-input v-model.trim="form.search" placeholder="主题" clearable style="width:100px"> </el-input>
                </el-form-item>
            </query_panel>
        </div>
        <template>
            <el-table ref="datatables" :data="datas" :stripe="true" tooltip-effect="dark" style="width: 100%"
                @selection-change="val=>selects=val" @row-dblclick="rowdblclick">
                <el-table-column type="selection" width="35">
                </el-table-column>
                <el-table-column type="index" width="50" align="center">
                    <template slot-scope="scope">
                        <span>{{(form.index - 1) * form.size + scope.$index + 1}}</span>
                    </template>
                </el-table-column>
                <el-table-column label="主题">
                    <template slot-scope="scope">

                        <el-link :type="scope.row.Lcs_IsEnable ? 'primary' :'info'" title="点击查看学习卡"
                            @click="$refs.btngroup.pagebox('cards?id='+scope.row.Lcs_ID,'“'+scope.row.Lcs_Theme+'”的卡片详情',null,'900','80%')">
                            <span class="el-icon-open enable" v-if="scope.row.Lcs_IsEnable"></span>
                            <span class="el-icon-turn-off disable" v-if="!scope.row.Lcs_IsEnable"></span> <span
                                class="large" v-html="showsearch(scope.row.Lcs_Theme,form.search)"></span>
                        </el-link>
                    </template>
                </el-table-column>
                <el-table-column label="课程数" width="80" align="center">
                    <template slot-scope="scope">
                        {{scope.row.Lcs_CoursesCount}}
                    </template>
                </el-table-column>
                <el-table-column label="数量" width="120">
                    <div slot="header" style="text-align: center;">数量</div>
                    <template slot-scope="scope">
                        <span title="已经使用" class="usedCount">{{scope.row.Lsc_UsedCount}}</span> / <span title="总数"
                            class="sumCount">{{scope.row.Lcs_Count}}</span>
                    </template>
                </el-table-column>
                <el-table-column label="面额" width="80">
                    <template slot-scope="scope">
                        <icon money style="font-size: 14px;"></icon>{{scope.row.Lcs_Price}}

                    </template>
                </el-table-column>
                <el-table-column label="有效期">
                    <template slot="header">
                        <el-tooltip placement="bottom" effect="light">
                            <help>有效期</help>
                            <div slot="content">
                                有效期指学习卡可以使用的时限<br />
                                在有效期内使用学习卡<br />即可从使用那一刻起拥课程的学习时长</div>

                        </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                        {{scope.row.Lcs_LimitStart|date('yyyy-MM-dd')}}
                        至
                        {{scope.row.Lcs_LimitEnd|date('yyyy-MM-dd')}}
                    </template>
                </el-table-column>
                <el-table-column label="学习时长" width="100">
                    <template slot="header">
                        <el-tooltip placement="bottom" effect="light">
                            <help>学习时长</help>
                            <div slot="content">
                                学习卡使后，其关联课程能够允许学习的时长<br />
                                这个时长和学习卡的“有效期”没有关系</div>

                        </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                        {{scope.row.Lcs_Span}}
                        <span v-if="scope.row.Lcs_Unit=='月'">个</span>
                        {{scope.row.Lcs_Unit}}
                    </template>
                </el-table-column>
                <el-table-column label="启用" width="100">
                    <template slot-scope="scope">
                        <el-switch v-model="scope.row.Lcs_IsEnable" size="mini" active-text="启用"
                            @change="changeUse(scope.row)" v-show="loadingid!=scope.row.Lcs_ID">
                        </el-switch>
                    </template>
                </el-table-column>


                <el-table-column label="操作" show-overflow-tooltip width="60" align="center">
                    <template slot-scope="scope">
                        <el-dropdown>
                            <span class="el-dropdown-link">
                                管理<i class="el-icon-arrow-down el-icon--right"></i>
                            </span>
                            <el-dropdown-menu slot="dropdown">
                                <el-dropdown-item>
                                    <span icon="&#xe685"
                                        @click="$refs.btngroup.pagebox('cards?id='+scope.row.Lcs_ID,'“'+scope.row.Lcs_Theme+'”的卡片详情',null,'900','80%')">
                                        卡号管理
                                    </span>
                                </el-dropdown-item>
                                <el-dropdown-item>
                                    <span icon="&#xa04d"
                                        @click="$refs.btngroup.pagebox('BatchDistribution?id='+scope.row.Lcs_ID,' - 批量派发“'+scope.row.Lcs_Theme+'”的卡号',null,'1000','80%')">
                                        批量派发
                                    </span>
                                </el-dropdown-item>
                                <el-divider></el-divider>
                                <el-dropdown-item @click.native="outputExcel(scope.row)">
                                    <span icon="&#xe85e">导出Excel</span>
                                </el-dropdown-item>
                                <el-dropdown-item @click.native="outputQrCode(scope.row)">
                                    <span icon="&#xa053">导出二维码</span>
                                </el-dropdown-item>
                                <el-dropdown-item @click.native="batGoback(scope.row)">
                                    <span icon="&#xf007c"> 批量回滚 </span>
                                </el-dropdown-item>
                                <el-divider></el-divider>
                                <el-dropdown-item divided type="danger" icon="el-icon-edit" style="color:#409EFF"
                                    @click.native='$refs.btngroup.modifyrow(scope.row)'>
                                    修改
                                </el-dropdown-item>


                                <el-dropdown-item type="danger" icon="el-icon-delete" style="color:#F56C6C"
                                    @click.native='$refs.btngroup.delete(scope.row.Lcs_ID,{})'>
                                    删除
                                </el-dropdown-item>
                            </el-dropdown-menu>
                        </el-dropdown>
                    </template>


                </el-table-column>
            </el-table>

        </template>
        <div id="pager-box">
            <el-pagination v-on:current-change="handleCurrentChange" :current-page="form.index" :page-sizes="[1]"
                :page-size="form.size" :pager-count="12" layout="total, prev, pager, next, jumper" :total="total">
            </el-pagination>
        </div>
    </div>


</body>

</html>